<!-- 库存分析 -->
<template>
  <div class="clas_All">
    <el-row>
      <el-col :span="24">
        <div class="grid-content bg-purple-dark">
          <el-form :model="AllotList" size="small" :inline="true">
            <el-form-item prop="">
              <el-date-picker
                v-model="AllotList.paramTime"
                type="date"
                placeholder="选择日期"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item prop="">
              <el-input
                v-model="AllotList.menuName"
                placeholder="请输入物料编码"
                clearable
                @keyup.enter.native="getList"
              />
            </el-form-item>
            <el-form-item prop="">
              <el-input
                v-model="AllotList.menuName"
                placeholder="请输入物料名称"
                clearable
                @keyup.enter.native="getList"
              />
            </el-form-item>
            <el-form-item>
              <el-button type="primary" size="mini" @click="getList"
                >查询</el-button
              >
            </el-form-item>
          </el-form>
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-col>
        <el-table :data="menuList">
          <el-table-column
            align="center"
            prop="currentDate"
            label="采购日期"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="stapCode"
            label="物料编码"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="stapName"
            label="物料名称"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="currentCase"
            label="昨日库存"
          ></el-table-column>
          <!-- <el-table-column
            align="center"
            prop="procureAmount"
            label="采购"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="callAmount"
            label="调入"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="outAmount"
            label="调出"
          ></el-table-column> -->
          <el-table-column align="center" label="采购">
            <template slot-scope="scope">
              <div>
                <el-popover
                  placement="top-start"
                  :title="TopCenter"
                  width="600"
                  trigger="hover"
                  @show="nav(scope.row)"
                >
                  <!-- <p>物料编码:{{ dataList.fmaterialIdfnumber }}</p>
                  <p>物料名称:{{ dataList.fmaterialIdfname }}</p>
                  <p>实收数量:{{ dataList.frealQty }}</p>
                  <p>入库时间:{{ dataList.fdate }}</p> -->
                  <el-table :data="dataList">
                    <el-table-column prop="fmaterialIdfnumber" label="物料编码">
                    </el-table-column>
                    <el-table-column prop="fmaterialIdfname" label="物料名称">
                    </el-table-column>
                    <el-table-column prop="typeName" label="类型">
                    </el-table-column>
                    <el-table-column prop="frealQty" label="实收数量">
                    </el-table-column>
                    <el-table-column prop="fdate" label="入库时间">
                    </el-table-column>
                  </el-table>
                  <el-button type="text" slot="reference">{{
                    scope.row.inNum
                  }}</el-button>
                </el-popover>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="currentConsume"
            label="销售"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="lastCase"
            label="当日库存"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="consumeDay"
            label="日均消耗量"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="flowDay"
            label="周转天数"
          ></el-table-column>
          <el-table-column
            align="center"
            prop="deptCode"
            label="所属班组"
          ></el-table-column>
          <!-- <el-table-column
            align="center"
            prop="shopCode"
            label="所属门店"
          ></el-table-column> -->
        </el-table>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getStock, getCaseAnalsysIninfo } from "@/api/system/cost";
export default {
  data() {
    return {
      AllotList: {
        paramDate: "",
        stapCode: "",
        stapName: "",
      },
      inmonth: {},
      menuList: [],
      dataList: [],
      TopCenter: "",
    };
  },
  created() {},
  methods: {
    handleQuery() {},
    getList() {
      // inmonth
      // inids;
      getStock(this.AllotList).then((res) => {
        if (res.code == 200) {
          this.menuList = res.rows;
        }
      });
      // getCaseAnalsysIninfo().then((res) => {});
    },
    nav(v) {
      getCaseAnalsysIninfo({ inmonth: v.inmonth, inids: v.inids }).then(
        (res) => {
          res.data.filter((item, index) => {
            const date = new Date(item.fdate);
            const year = date.getFullYear();
            const month = String(date.getMonth() + 1).padStart(2, "0"); // 月份从 0 开始，需要加 1
            const day = String(date.getDate()).padStart(2, "0");
            item.fdate = `${year}-${month}-${day}`;
            if (item.type == 1) item.typeName = "采购入库单";
            if (item.type == 2) item.typeName = "门店采购单";
            if (item.type == 3) item.typeName = "分布式调入单";
            if (item.type == 4) item.typeName = "分布式调出单";
            if (item.flag == 1) item.frealQty += "(-)";
            if (item.flag == -1) item.frealQty += "(+)";
          });
          this.dataList = res.data;
          this.$forceUpdate();
        }
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.clas_All {
  margin: 20px;
}
</style>

<!-- 
  直接获取时间
 -->
